<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="renderer" content="webkit" />
  <meta name="robots" content="index, follow" />
  <title>KELLY RIGHT ™</title>
  <meta name="keywords" content="" />
  <meta name="description" content="" />
  <link rel="shortcut icon" href="skin/fonts/favicon.ico" />
  <link rel="bookmark" href="skin/fonts/favicon.ico" />
  <link rel="stylesheet" type="text/css" href="skin/css/font-awesome.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/bootstrap.min.css" media="screen" />
  <link rel="stylesheet" href="skin/css/bootstrap-datepicker3.css">
  <link rel="stylesheet" type="text/css" href="skin/css/owl.carousel.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/owl.theme.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/settings.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/style-red.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/tk.css" media="screen" />
  <script type="text/javascript" src="skin/js/jquery.min.js"></script>
  <script type="text/javascript" src="skin/js/zoom.js"></script>
  <script type="text/javascript" src="skin/js/bootstrap.min.js"></script>
  <script src="skin/js/bootstrap-datepicker.js"></script>
  <script type="text/javascript" src="skin/js/template-web.js"></script>
  <script type="text/javascript" src="skin/js/owl.carousel.min.js"></script>
  <!-- 列表 -->
  <script type="text/html" id="detail">
    {{each saledetail v}}
    <div class="main col-md-8 inner-left" role="main" id="detailes">

      <!-- 信息 -->
      <div class="infomation">
        <div class="nm">{{v.address.full}}</div>
        <!-- 地点 -->
        <ul class="area clearfix">
          <li>{{v.address.city}}, {{v.address.state}}</li>
          <li class="hidden-xs">Aurora Estates</li>
          <li class="hidden-xs">Listing ID: {{v.listingId}}</li>
        </ul>
      </div>

      <!-- 选项 -->
      <div class="select clearfix">
        <ul class="box clearfix">
          <li class="">${{v.listPrice}}</li>
        </ul>

        <ul class="box1 clearfix" id="czbox">
          <li class="pic" id="fenxiang">
            <img src="./skin/images/fenxiang.png" alt="">
          </li>
          <li class="pic" id="collecting" data-item="{{v}}">
            {{if (v.isCollect != 1)}}
            <img src="./skin/images/aixin.png" alt="">
            {{else if(v.isCollect == 1)}}
            <img src="./skin/images/aixin_full.png" alt="">
            {{/if}}
          </li>
        </ul>
      </div>

      <!-- 情况 -->
      <div class="situation">
        <div class="row box">
          <div class="col-xs-3 it">
            <img class="photo photo1 hidden-xs hidden-sm" src="./skin/images/property-detail-icon1.png" alt="" />
            <span class="qkspan">{{ v.property.Bedrooms ? v.property.Bedrooms : 'N/A' }}</span> Bed
          </div>

          <div class="col-xs-3 it">
            <img class="photo hidden-xs hidden-sm" src="./skin/images/property-detail-icon2.png" alt="" />
            <span class="qkspan">{{ v.property.Bathrooms ? v.property.Bathrooms : 'N/A' }}</span> Bath
          </div>

          <div class="col-xs-3 it">
            <img class="photo hidden-xs hidden-sm" src="./skin/images/property-detail-icon3.png" alt="" />
            <span class="qkspan">{{ v.property.Area ? v.property.Area : 'N/A' }}</span> Sqft
          </div>

          <div class="col-xs-3 it">
            <img class="photo hidden-xs hidden-sm" src="./skin/images/property-detail-icon5.png" alt="" />
            <span class="qkspan">{{ v.property.SubType ? v.property.SubType : 'N/A' }}</span>
          </div>
        </div>
      </div>


      <!-- 展示 -->
      <div class="blog-wrap" id="listbox">
        <!-- 渲染的地方 -->
        <div class="blog-article hentry format-image">
          <!-- 上 图 -->
          <div class="fgr">

            <!-- 轮播图 data-ride="carousel" data-interval="7000" -->
            <div class="carousel slide" id="slidershow">

              <!-- 小点 -->
              <ol class="carousel-indicators" style="display: none;">
                {{each v.photos v2 index1}}
                {{if index1 == 0}}
                <li class="active" data-target="#slidershow" data-slide-to="0"></li>
                {{else if (index1 != 0)}}
                <li data-target="#slidershow" data-slide-to="{{index1}}"></li>
                {{/if}}
                {{/each}}
              </ol>

              <!-- 图片 -->
              <div class="carousel-inner">
                {{each v.photos v1 index2}}
                {{if index2 == 0}}
                <div class="item active">
                  <img src="{{v1}}" class="photo smallimg" />
                </div>
                {{else if (index2 != 0)}}
                <div class="item">
                  <img src="{{v1}}" class="photo smallimg" />
                </div>
                {{/if}}
                {{/each}}

                <!-- 张数 -->
                <div class="totNumsdi hidden-xs">
                  <div class="img">
                    <img src="./skin/images/tupian.png" class="pho" alt="">
                  </div>
                  <div class="ttt">Photos</div>
                  <div class="ttt">

                    <!-- {{each v.photos v3 index3}}
                      {{if (index3 == index3)}}
                        {{index3}}
                      {{/if}}
                    {{/each}} -->
                    {{v.photos.length}}
                  </div>
                </div>

                <!-- 轮播导航 箭头 -->
                {{if (v.photos.length > 1)}}
                <a href="#slidershow" data-slide="prev" class="left carousel-control" role="button">
                  <img src="./skin/images/jiantouxiangzuo.png" />
                </a>

                <a href="#slidershow" data-slide="next" class="right carousel-control" role="button">
                  <img src="./skin/images/jiantouxiangyou.png" />
                </a>
                {{/if}}
              </div>

              <img src="" alt="" class="bigimg" id="BigImg">

              <div class="maskess">
                <img src="./skin/images/maskclose.png" alt="">
              </div>

            </div>

          </div>

          <!-- 下 信息 -->
          <div class="specific">
            <!-- 联系方式 -->
            <div class="contact clearfix">
              <div class="l-box clearfix">
                <p class="">Contact</p>
                <!-- <p class="active">{{v.agent.firstName}} {{v.agent.lastName}}</p> -->
                <p class="active">Charlotte Wolverton, Broker</p>
              </div>

              <ul class="r-box clearfix">
                <!-- <li class="pic hidden-xs hidden-sm">
                <img src="./skin/images/shexiangji.png" alt="">
              </li>

              <li class="pic hidden-xs hidden-sm">
                <img src="./skin/images/ditu.png" alt="">
              </li> -->

                <li class="orange callphone">Call</li>
                <li class="orange agentemail">Email</li>
              </ul>

            </div>


            <!-- Property Description 属性说明 -->
            <div class="description">
              <h3>Property Description:</h3>
              <p>{{v.remarks}}</p>
            </div>

            <!-- Property Overview 物业概况 -->
            <div class="overview">
              <h3 class="title">Property Overview</h3>
              <!-- 内容 -->
              <div class="content">
                <!-- 渲染 -->
                {{each v.property value key}}
                {{if (value && typeof(value) != 'object')}}
                <div class="row item">
                  <div class="col-xs-4 l">{{key}}</div>
                  <div class="col-xs-8 r">{{value}}</div>
                </div>
                {{/if}}
                {{/each}}

              </div>
            </div>

            <!-- Special Features 特殊功能 -->
            <!-- {{if (v.property.Parking.spaces || v.property.Pool)}}
            <div class="features">
              <h3 class="title">Special Features</h3>
      
              <div class="content">
                {{if v.property.Parking.spaces}}
                <div class="row item">
                  <div class="col-xs-4 l">Parking Spaces</div>
                  <div class="col-xs-8 r">{{v.property.Parking.spaces}}</div>
                </div>
                {{/if}}

                {{if v.property.Pool}}
                <div class="row item">
                  <div class="col-xs-4 l"> Swimming Pool</div>
                  <div class="col-xs-8 r">Yes</div>
                </div>
                {{/if}}

              </div>
            </div>
            {{/if}} -->

            <!-- Nearby Schools 附近的学校 -->
            {{if (v.school.elementarySchool || v.school.middleSchool || v.school.elementarySchool)}}
            <div class="schools">
              <h3 class="title">Nearby Schools</h3>
              <!-- 内容 -->
              <div class="content">
                {{if v.school.elementarySchool}}
                <div class="row item">
                  <div class="col-xs-4 tw">Elementary School</div>
                  <div class="col-xs-4 o">{{v.school.elementarySchool}}</div>
                  <!-- <div class="col-xs-2 th">9 - 12</div>
                    <div class="col-xs-4 fo">0.26 km</div> -->
                </div>
                {{/if}}

                {{if v.school.middleSchool}}
                <div class="row item">
                  <div class="col-xs-4 tw">Middle School</div>
                  <div class="col-xs-4 o">{{v.school.middleSchool}}</div>
                  <!-- <div class="col-xs-2 th">9 - 12</div>
                    <div class="col-xs-4 fo">1.32 km</div> -->
                </div>
                {{/if}}

                {{if v.school.highSchool}}
                <div class="row item">
                  <div class="col-xs-4 tw">HighSchool School</div>
                  <div class="col-xs-4 o">{{v.school.highSchool}}</div>
                  <!-- <div class="col-xs-2 th">JK - 8</div>
                    <div class="col-xs-4 fo">1.35 km</div> -->
                </div>
                {{/if}}

                <!-- show me -->
                <!-- <div class="row show">
                  show more
                </div> -->

                <!-- 说明 -->
                <div class="row explain">
                  School catchments and distances are intended to be used as reference only. To verify enrolment
                  eligibility for a property, contact the school directly.
                  <!-- <span>Report Incorrect Info</span> -->
                </div>

              </div>
            </div>
            {{/if}}

            <!-- 联系方式 -->
            <div class="methods clearfix">
              <div class="l-box clearfix">
                <p class="">Contact</p>
                <!-- <p class="active">{{v.agent.firstName}} {{v.agent.lastName}}</p> -->
                <p class="active">Charlotte Wolverton, Broker</p>
              </div>

              <ul class="r-box clearfix">
                <!-- <li class="pic hidden-xs hidden-sm">
                <img src="./skin/images/shexiangji.png" alt="">
              </li>

              <li class="pic hidden-xs hidden-sm">
                <img src="./skin/images/ditu.png" alt="">
              </li> -->

                <li class="orange callphone">Call</li>
                <li class="orange agentemail">Email</li>
              </ul>
            </div>

            <!-- servingName -->
            <div class="servingName">
              <div class="row">
                <div class="col-xs-5 col-sm-5 title">Listing Courtesy of Servingname</div>
                <div class="col-xs-7 col-sm-4 txt">{{v.office.servingName}}</div>
              </div>
            </div>

          </div>


        </div>
      </div>
    </div>


    <!-- 右 侧边 -->
    <div class="sidebar col-md-4 inner-right" role="complementary">
      <div class="widget side-news">

        <!-- 下 表单 -->
        <div class="apply">
          <!-- 人员 -->
          <div class="title row">
            <div class="col-xs-4 lpic">
              <!-- <img src="{{v.agent.photo ? v.agent.photo : './skin/images/default-touxiang.png' }}" alt="" class="ig" /> -->
              <img src="./skin/images/customer.jpg" class="ig" alt="" />
            </div>
            <div class="col-xs-8 rinfo">
              <!-- <p class="fz">Salesperson</p>
              <p class="link">{{v.agent.firstName}} {{v.agent.lastName}}</p>
              <p class="em">{{v.office.servingName}}</p>
              <p class="link link1" id="view-agentPhone">View Phone</p> -->

              <p class="link">Charlotte Wolverton, Broker</p>
              <p>ASP, CNHS, CRS, GRI, PSA, RCC</p>
              <p>Kelly Right Real Estate</p>
              <p class="link link1" id="view-agentPhone">M: <a class="tells" href="tel: 509-747-SOLD">509-747-SOLD
                  (7653)</a></p>
            </div>
          </div>

          <!-- write -->
          <div class="write" id="sendConsults">
            <form action="">
              <div class="item" id="selectDate">
                <div class="cox-xs-12 commoDates">

                  <input data-provide="datepicker" id="f-date" class="in" placeholder="Preferred Date">
                  <div class="ts">cannot be blank</div>

                </div>
              </div>

              <div class="item" id="myNameS">
                <div class="cox-xs-12">
                  <input type="text" id="f-name" value="" class="in" placeholder="Name*" />
                  <div class="ts">cannot be blank</div>
                </div>
              </div>

              <div class="item" id="myEmailS">
                <div class="cox-xs-12">
                  <input type="text" id="f-email" value="" class="in" placeholder="Email*" />
                  <div class="ts">cannot be blank</div>
                </div>
              </div>

              <div class="item" id="myPhoneS">
                <div class="cox-xs-12">
                  <input type="text" id="f-phone" class="in" placeholder="Phone Number" />
                  <div class="ts">cannot be blank</div>
                </div>
              </div>

              <div class="item rad">
                <div class="cox-xs-12 isrobottbox">
                  <input type="checkbox" name="" id="bot" class="isrobott">
                  <label class="lab" for="bot">I am not a robot</label>
                </div>
              </div>

              <div class="item submit" id="subSend">
                <div class="cox-xs-12">
                  <input type="button" value="Submit Viewing Request" class="in" />
                </div>
              </div>

            </form>
          </div>
        </div>
      </div>
    </div>

    {{/each}}
  </script>

  <!-- 所在页 -->
  <script type="text/html" id="current">
    {{each curr v i}}
    <div class="row tline hidden-xs">
      <div class="col-md-8 col-sm-7 location">
        <!-- <i class="fa fa-map-marker"></i> &nbsp; -->
        <span>
          <a href='./index.html' class="color">Real Estate For Sale</a>
          <span class="dy"> > </span>
          <a href='javascript:void(0);' onClick="javascript :history.back(-1);" class="color"> <span
              id="goSaleList">Search Results</span></a>
          <span class="dy"> > </span>
          <span>{{v.full}}</span>
        </span>
      </div>

      <!-- <div class="col-md-4 col-sm-5 bcid-cat">
          <input type="text" class="sr" placeholder="Where are you looking for?">
          <div class="rig">
            <i class="fa fa-search"></i>
          </div>
        </div> -->

    </div>

    <div class="row backto hidden-sm hidden-md hidden-lg">
      <a href="javascript:void(0);" onClick="javascript :history.back(-1);"> <span>
          <</span> Back to Search Results</a> </div> {{/each}}
  </script>

  <!-- 电话弹窗: 代理信息 -->
  <script type="text/html" id="houseagent">
    {{each agent v i}}
    <div class="inboxs">
      <!-- 关闭 -->
      <div class="closebtn">
        Call Agent
      </div>

      <!-- 代理信息 -->
      <div class="agentinfo clearfix">
        <div class="photo">
          <!-- <img src="{{v.agent.photo ? v.agent.photo : './skin/images/default-touxiang.png' }}" alt="" class="tp"> -->
          <img src="./skin/images/customer.jpg" alt="" class="tp">
        </div>

        <div class="infomation">
          <!-- <div class="ty">Salesperson</div> -->
          <!-- <div class="name">{{v.agent.firstName}} {{v.agent.lastName}}</div> -->
          <div class="name">Charlotte Wolverton</div>
          <div class="introducts">ASP, CNHS, CRS, GRI, PSA, RCC</div>
          <div class="introducts lastone">Kelly Right Real Estate</div>
          <!-- {{ if (v.agent.contact.phone) }}
            <div class="phone">Phone: <span><a href="tel: {{v.agent.contact.phone}}">{{v.agent.contact.phone}}</a></span></div>
          {{ /if }} -->
          <div class="phone">M: <span><a href="tel: 509-747-SOLD">509-747-SOLD</a> (7653)</span></div>

          <!-- {{ if (v.agent.contact.cell) }}
            <div class="cell">Cell: <span><a href="tel: {{v.agent.contact.cell}}">{{v.agent.contact.cell}}</a></span></div>
          {{ /if }}

          {{ if (v.agent.contact.office) }}
            <div class="office">Office: <span><a href="tel: {{v.agent.contact.office}}">{{v.agent.contact.office}}</a></span></div>
          {{ /if }} -->

        </div>
      </div>
    </div>
    {{/each}}
  </script>

  <!-- Similar Listings -->
  <script type="text/html" id="similar">
    {{if slist.length}}
    <h3 class="text-center section-title titles">
      <a href="javascript:;" class="chi">Listings You Might Be Interested In</a>
    </h3>
    {{/if}}

    <div class="portfolio-box owl-wrapper" id="simListsTwo">

      <div class="owl-carousel" id="owl-simexample" data-num="4">
        {{each slist v i}}

        <div class="item project-post" data-id="{{v.mlsId}}">
          <div class="newBoxs">
            <div class="project-gallery">
              <img src="{{v.photos[0]}}" />

              <div class="hover-box">
                ${{v.listPrice}}
              </div>
            </div>

            <div class="introducts">
              <h3 class="iport-h3-title">{{v.address.full}}</h3>

              <ul class="tbox clearfix">
                <li>{{v.address.city}}</li>
                <li>{{v.address.state}}</li>
              </ul>

              <ul class="tbox box2 clearfix">
                {{ if (v.property.bedrooms) }}
                <li>{{v.property.bedrooms}} bd</li>
                {{ /if }}

                {{ if (v.property.bathsFull) }}
                <li>{{v.property.bathsFull}} ba</li>
                {{ /if }}

                {{ if (v.property.area)}}
                <li>{{v.property.area}} sf</li>
                {{ /if }}
              </ul>

              <div class="footer clearfix">
                <div class="lagent">
                  <div class="nms">{{v.agent.firstName}} {{v.agent.lastName}}</div>
                  <div class="dl">{{v.office.servingName}}</div>
                </div>
                <!-- <div class="raixin">
                  {{if (v.isCollect != 1)}}
                  <img src="./skin/images/aixin.png" alt="">
                  {{else if(v.isCollect == 1)}}
                  <img src="./skin/images/aixin_full.png" alt="">
                  {{/if}}
                </div>
                <div class="mask"></div> -->
              </div>
            </div>
          </div>

        </div>

        {{/each}}
      </div>
    </div>
  </script>

  <!-- Others Also Viewed -->
  <script type="text/html" id="other">
    {{if olist.length}}
      <h3 class="text-center section-title titles">
        <a href="javascript:;" class="chi">Others Also Viewed</a>
      </h3>
    {{/if}}

    <div class="news-box owl-wrapper" id="othersAlso">
      <div class="owl-carousel" id="owl-otherEx" data-num="4">
        {{each olist v i}}
        <div class="item project-post" data-id="{{v.mlsId}}">
          <div class="project-gallery">
            <img src="{{v.photos[0]}}" />

            <div class="hover-box">
              ${{v.listPrice}}
            </div>
          </div>

          <div class="introducts">
            <h3 class="iport-h3-title">{{v.address.full}}</h3>

            <ul class="tbox clearfix">
              <li>{{v.address.city}}</li>
              <li>{{v.address.state}}</li>
            </ul>

            <ul class="tbox box2 clearfix">
              {{ if (v.property.bedrooms) }}
                <li>{{v.property.bedrooms}} bd</li>
              {{ /if }}

              {{ if (v.property.bathsFull) }}
                <li>{{v.property.bathsFull}} ba</li>
              {{ /if }}

              {{ if (v.property.area)}}
                <li>{{v.property.area}} sf</li>
              {{ /if }}
            </ul>

            <div class="footer clearfix">
              <div class="lagent">
                <div class="nms">{{v.agent.firstName}} {{v.agent.lastName}}</div>
                <div class="dl">{{v.office.servingName}}</div>
              </div>
              <!-- <div class="raixin">
                {{if (v.isCollect != 1)}}
                <img src="./skin/images/aixin.png" alt="">
                {{else if(v.isCollect == 1)}}
                <img src="./skin/images/aixin_full.png" alt="">
                {{/if}}
              </div>
              <div class="mask" data-item="{{v}}"></div> -->
            </div>
          </div>

        </div>
        {{/each}}
      </div>
    </div>
  </script>

</head>

<body>
  <div id="container" class="saleDetail" style="background: #F9FBFC;">
    <!-- 导航栏 -->
    <header class="clearfix" id="header-sec">
      <nav class="navbar navbar-default navbar-fixed-top pbox" role="navigation">

        <div class="container-fluid">

          <!-- 左 logo -->
          <div class="navbar-header">
            <!-- 移动端按钮 -->
            <a class="navbar-toggle collapsed mmenu-btn" href="#mmenu">
              <!-- <span class="sr-only">Toggle navigation</span>
                  <span class="icon-bar"></span> 
                  <span class="icon-bar"></span> 
                  <span class="icon-bar"></span>  -->
              <img src="./skin/images/mobile-qttab.png" alt="">
            </a>

            <!-- pc -->
            <a class="navbar-brand hidden-xs hidden-sm hiddenMobEle" href="javascript:;">
              <img src="./skin/images/logo.png" alt="" class="logo" />
            </a>

            <!-- 移动 -->
            <a class="navbar-brand hidden-md hidden-lg hiddenPccEle" href="javascript:;">
              <img src="./skin/images/log-logo.png" alt="" class="logo" />
            </a>

          </div>

          <!-- tab -->
          <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

            <ul class="nav navbar-nav navbar-left" id="navigation1">
              <li class="Lev1">
                <a href="./index.html" class='menu1 active'>Homes for Sale </a>
              </li>

              <li class="Lev1">
                <a href="./aboutCharlotte.html" class='menu1'>About Charlotte</a>
              </li>

              <li class="Lev1">
                <a href="./contactUs.html" class='menu1'>Contact Us</a>
              </li>

              <!-- <li class="Lev1">
                    <a href="./openHouses.html" class="menu1">Open Houses</a>
                  </li> -->

              <!-- <li class="Lev1">
                    <a href="javascript:void(0);" class="menu1">New Developments</a>
                  </li>
    
                  <li class="Lev1">
                    <a href="javascript:void(0);" class="menu1">Buildings
                    </a>
    
                  </li>
    
                  <li class="Lev1">
                    <a href="javascript:void(0);" class="menu1">Find an Agent
                    </a>
    
                  </li>
    
                  <li class="Lev1">
                    <a href="javascript:void(0);" class="menu1">Blog
                    </a>
                  </li> -->
            </ul>

            <ul class="nav navbar-nav navbar-right" id="navigation2">

              <li class="Lev1">
                <a href="./sign-up.html" class="menu1 giwid">SIGN UP</a>
              </li>

              <li class="Lev1">
                <a href="javascript:void(0);" class="menu1 giwid activeLogin">LOG IN</a>
              </li>

              <li class="afterLogin" style="display: none">
                <a class="ele-a" href="#">
                  <!-- 注册时输入的用户名 -->
                  <span class="atext">username</span>
                  <div class="arr-down">
                    <img src="./skin/images/jiantouxia.png" alt="">
                  </div>
                </a>

                <!-- 用户相关 -->
                <ul class="aboutUser">
                  <li class="item">
                    <a href="./account-details.html" class="in">
                      <span class="">Account Details</span>
                    </a>
                  </li>

                  <li class="item" id="userFavourite">
                    <a href="./collection.html" class="in">
                      <span class="">Favorites</span>
                      <span class="favNum">0</span>
                    </a>
                  </li>

                  <li class="item">
                    <p class="signOut">Sign Out</p>
                  </li>
                </ul>

              </li>

            </ul>

          </div>

        </div>

      </nav>
    </header>

    <!-- sign in -->
    <div class="signin none">
      <div class="content">
        <!-- 关闭 -->
        <div class="closebtn"></div>

        <!-- logo -->
        <div class="dllogos">
          <div class="photo">
            <img src="./skin/images/log-logo.png" class="thepicture" alt="">
          </div>
        </div>

        <!-- 提示登录 -->
        <!-- <div class="tsinfo">Please login to your account before seeing the information. </div> -->

        <!-- 用户 -->
        <div class="userinfo login-normal" id="userInfo">
          <form action="">
            <!-- 导航 -->
            <div class="row navbares" id="signNav">

              <div class="col-xs-4 col-xs-offset-4 col-sm-2 col-sm-offset-7 up">
                <span>Sign Up</span>
              </div>

              <div class="col-xs-4 col-sm-2 log active">
                <span>Log In</span>
              </div>

            </div>

            <!-- sign up -->
            <div class="row usersignup">
              <!-- <div class="row free">
                Create a FREE account to save searches and track your favourite homes. Already have an account? Click
                the Log In tab.
              </div> -->

              <!-- 提示 -->
              <div class="row upalert" id="upginTips">You have signed up successfully, please log in to account.
              </div>

              <div class="row name">
                <div class="title">Name</div>
                <input type="text" placeholder="" name="" id="input_name1">
                <div class="ts">cannot be blank</div>
              </div>

              <div class="row email">
                <div class="title">Email</div>
                <input type="email" placeholder="" name="" id="input_email1">
                <div class="ts">please enter the correct email</div>
                <div class="exist">account already exists</div>
              </div>

              <div class="row password">
                <div class="title">Phone Number <span class="usedfor">(Used for Password)</span></div>
                <input type="text" placeholder="" name="" id="input_password1">
                <div class="ts">cannot be blank</div>
              </div>

              <!-- <div class="row confirm">
                <div class="title">Confirm Password</div>
                <input type="password" placeholder="" name="" id="input_confirm1">
                <div class="ts">does not match password</div>
              </div> -->

              <!-- 确定 -->
              <div class="row upsubmit">
                <p class="tj active">Sign Up</p>
              </div>

              <div class="row confirm2">
                <!-- <input type="checkbox" name="" value="0" id=""> -->
                <div class="pictur active"></div>
                Get emailed when we find more properties that suit your tastes! We'll notify you daily of new
                listings &
                price changes.
              </div>

              <div class="row bottomTiS">
                By clicking continue or sign up, you agree to our linked <span class="hs">Terms of
                  Use</span> and <span class="hs">Privacy Policy</span>
              </div>
            </div>

            <!-- log in -->
            <div class="row usersignin">
              <!-- <div class="row tit">
                <p>
                  Don't have an account? Click on the Sign Up tab.
                </p>
              </div> -->

              <!-- 提示 -->
              <div class="row alert" id="loginTips">Invalid email or password.</div>

              <div class="row email">
                <div class="title">Email</div>
                <input type="email" name="" placeholder="" id="input_email">
                <div class="ts">Please enter the correct email</div>
              </div>

              <div class="row password">
                <div class="title">Phone Number <span class="usedfor">(Used for Password)</span></div>
                <input type="text" name="" placeholder="" id="input_password">
                <div class="ts">cannot be blank</div>
              </div>

              <div class="row loginsubmits">
                <p class="tj active">Log In</p>
              </div>

              <!-- 是否保持状态 忘记密码 -->
              <div class="row combine">
                <!-- 保持状态 -->
                <div class="col-xs-12 col-sm-6 rad">
                  <!-- <input type="checkbox" value="0" name="agree" id="check"> -->
                  <div class="pictur active"></div>
                  Stay logged in
                </div>

                <div class="col-xs-12 col-sm-6 access">
                  <p>
                    <a href="javascript: void(0);" id="forgetword">Can't access your account?</a>
                  </p>
                </div>

              </div>


            </div>

          </form>

        </div>

        <!-- 忘记密码 -->
        <div class="row findpassword login-find" style="display: none;">
          <div class="row tit">
            <p>
              Enter the email address you registered with and your password will be sent to you.
            </p>
          </div>

          <!-- 提示 -->
          <div class="row alert" id="findpaTips">Invalid email.</div>

          <div class="row email" id="emaFi">
            <div class="title">Email</div>
            <input type="email" name="" placeholder="" id="sendEmail">
            <div class="ts">Please enter the correct email.</div>
          </div>

          <div class="row send" id="sendPass">
            <p class="tj active">Send Password</p>
          </div>

          <div class="row back">
            <p>
              <a href="javascript: void(0);">Back to log in page</a>
            </p>
          </div>

        </div>

      </div>
    </div>

    <!-- share -->
    <div class="share" id="shareBox">
      <div class="content">
        <div class="closebtn">
          Share this Property
        </div>

        <div class="userinfo" id="sendEamil">
          <form action="">

            <div class="row email">
              <input type="email" name="" placeholder="Recipient Email Address*" id="recipientEmail">
              <div class="ts">please enter the correct email</div>
            </div>

            <div class="row myemail">
              <input type="email" name="" placeholder="Your Email Address*" id="yourEmail">
              <div class="ts">please enter the correct email</div>
            </div>

            <div class="row rad">
              <textarea name="" id="" class="thetext sharestreent" cols="30" rows="10"
                value="I found a listing at the Street that I wanted to share with you."></textarea>
            </div>

            <div class="row sendSubmit">
              <p class="tj">SEND</p>
            </div>

          </form>


        </div>

      </div>
    </div>

    <!-- 所在页 -->
    <div class="breadcrumb-wrapper">
      <div class="container" id="cerrPage"></div>
    </div>

    <!-- 内容 -->
    <div class="page-container" id="innerpage-wrap">
      <div class="container">
        <!-- 主要 -->
        <div class="row maincontent" id="xrcontent"></div>

        <!-- Similar Listings 类似列表 -->
        <div class="portfolio-section portfolio1 similar" id="index-portfolio">
          <div class="container" id="detailSimilarList"></div>
        </div>

        <!-- Others Also Viewed 其他人在看的 -->
        <div class="portfolio-section portfolio2 oalsoview" id="index-news">
          <div class="container" id="detailOthersList"></div>
        </div>


      </div>
    </div>

    <!-- 免责 -->
    <div class="disclaimer">
      <div class="container tobox">
        <div class="row">
          <div class="col-xs-12">
            <div class="bgfill">
              <div class="media">
                <div class="media-body">
                  Listings made available courtesy of the Spokane Association of REALTORS®MLS. Copyright 2019 of the
                  Spokane
                  Association of REALTORS®MLS. All rights reserved.
                  <br />
                  IDX Data is provided exclusively for consumers' personal, non-commercial use, it may not be used for
                  any
                  purpose other than to identify prospective properties consumers may be interested in purchasing, data
                  is
                  deemed reliable but is not guaranteed accurate by the Spokane Association of REALTORS®MLS.
                </div>
              </div>
            </div>

          </div>


        </div>

      </div>

    </div>

    <!-- 电话弹窗 -->
    <div class="mobileTips" id="show-MobileTips">
      <div class="content" id="agentinfos"></div>
    </div>

    <!-- Email Agent 弹窗 -->
    <div class="emailTips" id="sendEmailToagent">
      <div class="content">
        <div class="closebtn">
          Email Agent
        </div>

        <!-- 代理信息 -->
        <div class="infotions clearfix">
          <div class="in-pic">
            <img src="./skin/images/customer.jpg" class="ig" alt="" />
          </div>

          <div class="agentInfo">
            <p class="link">Charlotte Wolverton, Broker</p>
            <p>ASP, CNHS, CRS, GRI, PSA, RCC</p>
            <p>Kelly Right Real Estate</p>
            <p class="link link1" id="view-agentPhone">M: <a class="tells" href="tel: 509-747-SOLD">509-747-SOLD
                (7653)</a></p>
          </div>
        </div>

        <div class="personalData" id="sendtoAgent">
          <form action="">

            <div class="row youremail">
              <input type="email" name="" placeholder="Your Email*" id="fromEmail">
              <div class="ts">cannot be blank</div>
            </div>

            <div class="row rador">
              <textarea name="" id="" class="textinbox" value="" placeholder="Enter your message here." cols="30"
                rows="10"></textarea>
            </div>

            <div class="row subSend" id="isSend">
              <p class="send">Send</p>
            </div>
          </form>
        </div>
      </div>
    </div>


    <!-- 底部 -->
    <div class="commonfoot">
      <div class="container  hidden-xs hidden-sm">

        <div class="row">

          <div class="col-md-4 col-lg-4  foot-contact rightbox">
            <div class="f-contact ltxt">
              <p> <a href="javascript:void(0);">© 2019 Real Estate Website by DotCom Agents</a></p>
              <p> <a href="javascript:void(0);">All rights reserved. Privacy and Terms</a></p>
            </div>
          </div>

          <div class="col-md-4 col-lg-4 foot-contact">
            <div class="f-contact">
              <ul class="box clearfix">
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom1.png" alt="" class="pic">
                  </a>
                </li>
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom2.png" alt="" class="pic">
                  </a>
                </li>
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom3.png" alt="" class="pic">
                  </a>
                </li>
              </ul>
            </div>
          </div>

          <div class="col-md-4 col-lg-4 foot-contact">
            <div class="f-contact rtxt">
              <p> <a href="./aboutCharlotte.html">ABOUT US</a></p>
              <p> <a href="./contactUs.html">CONTACT US</a></p>
            </div>
          </div>

        </div>

      </div>

      <div class="container hidden-md  hidden-lg">

        <div class="row">

          <div class="col-xs-12 col-sm-12 foot-contact">
            <div class="f-contact one">
              <ul class="about clearfix">
                <li><a href="./aboutCharlotte.html">ABOUT US</a></li>
                <li><a href="./contactUs.html">CONTACT US</a></li>
              </ul>
            </div>
          </div>

          <div class="col-xs-12 col-sm-12 foot-contact">
            <div class="f-contact two">
              <ul class="box clearfix">
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom1.png" alt="" class="pic">
                  </a>
                </li>
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom2.png" alt="" class="pic">
                  </a>
                </li>
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom3.png" alt="" class="pic">
                  </a>
                </li>
              </ul>
            </div>
          </div>

          <div class="col-xs-12 col-sm-12  foot-contact">
            <div class="f-contact three">
              <p> <a href="javascript:void(0);">© 2019 Real Estate Website by DotCom Agents</a></p>
              <p> <a href="javascript:void(0);">All rights reserved. Privacy and Terms</a></p>
            </div>
          </div>
        </div>

      </div>
    </div>

    <!-- 返回顶部 -->
    <div class="commongoback" id="toTop">
      <div class="icon">
        <img src="./skin/images/up.png" />
      </div>
      top
    </div>

    <!-- 加载中 -->
    <div class="load">
      <div class="ing">
        <img src="./skin/images/jiazaizhong.gif" class="photo" alt="">
      </div>
    </div>

    <!-- 提示: 通用 -->
    <div class="commonTips">
      <img class="pic" src="./skin/images/dui.png" alt="">
      <span class="txt">The mail was sent successfully.</span>
      <div class="close">
        <img src="./skin/images/guanbi.png" alt="">
      </div>
    </div>

    <!-- 提示: 登录成功 -->
    <div class="success-logIn">
      <img class="pic" src="./skin/images/dui.png" alt="">
      <span class="txt">Logged in successfully.</span>
      <div class="close">
        <img src="./skin/images/guanbi.png" alt="">
      </div>
    </div>

    <!-- 提示: 退出成功 -->
    <div class="success-signOut">
      <img class="pic" src="./skin/images/dui.png" alt="">
      <span class="txt">Signed out successfully.</span>
      <div class="close">
        <img src="./skin/images/guanbi.png" alt="">
      </div>
    </div>

    <!-- 提示: 到邮箱找回密码 -->
    <div class="findmailbox">
      <img class="pic" src="./skin/images/dui.png" alt="">
      <span class="txt">You will receive an email with instructions about how to reset your password in a few
        minutes.</span>
      <div class="close">
        <img src="./skin/images/guanbi.png" alt="">
      </div>
    </div>


  </div>
  <script type="text/javascript" src="skin/js/jquery.migrate.js"></script>
  <!--<script type="text/javascript" src="skin/js/jquery.bxslider.min.js"></script>-->
  <script type="text/javascript" src="skin/js/jquery.imagesloaded.min.js"></script>
  <script type="text/javascript" src="skin/js/retina-1.1.0.min.js"></script>
  <script type="text/javascript" src="skin/js/jquery.themepunch.tools.min.js"></script>
  <script type="text/javascript" src="skin/js/jquery.themepunch.revolution.min.js"></script>
  <script type="text/javascript" src="skin/js/base64.min.js"></script>
  <script type="text/javascript" src="skin/js/base.js"></script>
  <script type="text/javascript" src="skin/js/axios.min.js"></script>
  <script type="text/javascript" src="skin/js/script.js"></script>

  <!-- 移动端导航 -->
  <nav id="mmenu" class="noDis">
    <div class="mmDiv">

      <!-- 关闭 -->
      <div class="closefixed closemenu">
        <img src="./skin/images/close_pic.png" alt="" style="width: 20px; height: 20px;">
      </div>

      <!-- sign log -->
      <div class="MMhead">
        <ul class="users clearfix">
          <!-- 登录前 -->
          <li class="before before1">
            <a href="./sign-up.html" class="noblock logins">Sign Up</a>
          </li>

          <li class="before">
            <a href="javascript:;" class="noblock activeLogin">Log In</a>
          </li>

          <!-- 登录后 -->
          <!-- Account Details -->
          <li class="afters afters1">
            <a href="./account-details.html" class="item account">
              <img src="./skin/images/log-ren.png" class="pic" alt="">
            </a>
          </li>

          <!-- Favourites -->
          <li class="afters">
            <a href="./collection.html" class="item account">
              <img src="./skin/images/log-aixin.png" class="pic" alt="">
              <span class="num" id="faNum">0</span>
            </a>
          </li>

        </ul>

      </div>


      <!-- nav -->
      <ul class="mobnavbar">
        <li class="box">
          <a href="./index.html">Homes for Sale</a>
        </li>

        <li class="box">
          <a href="./aboutCharlotte.html">About Charlotte</a>
        </li>

        <li class="box">
          <a href="./contactUs.html">Contact Us</a>
        </li>

        <!-- <li class="box">
            <a href="./openHouses.html" class="m-menu1">Open Houses</a>
          </li> -->

        <!-- <li class="box">
            <a href="javascript:;" class="m-menu1">New Developments</a>
          </li>
  
          <li class="box">
            <a href="" class="m-menu1">Buildings</a>
          </li>
  
          <li class="box">
            <a href="" class="m-menu1">Find an Agent</a>
          </li>
          
          <li class="box">
            <a href="" class="m-menu1">Find an Agent</a>
          </li>
  
          <li class="box">
            <a href="javascript:;" class="m-menu1">Blog</a>
          </li> -->
      </ul>

      <!-- sign out 登录后出现 -->
      <div class="footout">
        <a class="" href="javascript:;">Sign Out</a>
      </div>

    </div>
  </nav>

  <link type="text/css" rel="stylesheet" href="skin/css/jquery.mmenu.all.css" />
  <script type="text/javascript" src="skin/js/jquery.mmenu.all.min.js"></script>
  <script type="text/javascript">
    $(function ($) {
      var baseUrl = localStorage.getItem('baseUrl');
      var saledetail = {};

      setTimeout(() => {
        $('.datepicker').datepicker();
      }, 200)

      // function
      function formatNum(str) {
        var str = typeof str == 'string' ? str : str + '';
        var newStr = "";
        var count = 0;
        // 当数字是整数
        if (str.indexOf(".") == -1) {
          for (var i = str.length - 1; i >= 0; i--) {
            if (count % 3 == 0 && count != 0) {
              newStr = str.charAt(i) + "," + newStr;
            } else {
              newStr = str.charAt(i) + newStr;
            }
            count++;
          }
          str = newStr; //自动补小数点后两位 + ".00"
          return str;
        }
        // 当数字带有小数
        else {
          for (var i = str.indexOf(".") - 1; i >= 0; i--) {
            if (count % 3 == 0 && count != 0) {
              newStr = str.charAt(i) + "," + newStr;
            } else {
              newStr = str.charAt(i) + newStr; //逐个字符相接起来
            }
            count++;
          }
          str = newStr + (str + "00").substr((str + "00").indexOf("."), 3);
          return str;
        }
      }

      // 加载中
      function loading(m) {
        if (!m) {
          $('.load').show();
          setTimeout(() => {
            $('.load').hide();
          }, 1000)
        } else {
          $('.load').show();
          setTimeout(() => {
            $('.load').hide();
          }, m)
        }

      }

      // 从列表页来
      sessionStorage.setItem('fromList', 1);

      // 1 获取参数
      function getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]);
        return null;
      }

      var id = getUrlParam('id');

      if (id) {
        axios.post(baseUrl + `/mclient/srts/properties/${id}`, {}, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            if (res.data.code == 0 && res.data.msg == "success") {
              // console.log('-----获取不动产详情成功-----', res);

              saledetail = res.data.results;
              console.log('-----详情为: -----', saledetail);

              // 获取 Others Also Viewed  Similar Listings 列表
              getOtherListings();
              getSimilarListings();

              // 处理
              if (saledetail) {
                // 价格
                if (saledetail.listPrice) {
                  saledetail.listPrice = formatNum(saledetail.listPrice);
                }

                // 属性
                if (saledetail.property) {
                  var property = saledetail.property;
                  var obj = {};

                  for (var k in property) {
                    for (var i = 0; i < k.length; i++) {
                      if (k.charAt(i) >= 'A' && k.charAt(i) <= 'Z') {
                        let str = k.replace(/([A-Z])/g, " $1")
                        let value = str.substr(0, 1).toUpperCase() + str.substr(1)
                        obj[value] = property[k];
                        delete property[k];
                      }

                      if (k == 'bathsFull') {
                        k = 'BathsFull';
                        obj[k] = property[k];
                      }

                    }

                    let value = k.substr(0, 1).toUpperCase() + k.substr(1)
                    obj[value] = property[k];
                    delete property[k];
                  }

                  saledetail.property = obj;
                }

              }



              // 分享中的街道
              if (saledetail.address.full) {
                var showtxt = `I found a listing at ${saledetail.address.full} that I wanted to share with you.`;
                $('#sendEamil .rad .sharestreent').text(showtxt);
              }

              var html = template('detail', {
                saledetail: [saledetail]
              });


              $('#innerpage-wrap #xrcontent').html(html);

              // 所在页
              var curr = [{
                'full': saledetail.address.full
              }];
              var html1 = template('current', {
                curr: curr
              });
              $('#cerrPage').html(html1);

              // 代理信息
              var newAgentInfo = {};
              newAgentInfo.agent = saledetail.agent;
              newAgentInfo.office = saledetail.office;

              var agent = [newAgentInfo];
              var html2 = template('houseagent', {
                agent: agent
              });
              $('#agentinfos').html(html2);

              /*
              smallimg // 小图
              bigimg //点击放大的图片
              mask //黑色遮罩
              */
              var objhjk = new zoom('maskess', 'bigimg', 'smallimg');
              objhjk.init();


            } else {
              console.log('-----获取数据失败-----', res.data.msg)
            }

          })

          .catch(function (res) {
            console.log('-----发送请求失败-----', res);
          });
      }

      // 2 判断用户是否登录
      function usertologin(request) {
        var token = localStorage.getItem('token');
        // 未登录
        if (!token) {
          // 2.1 弹窗
          $('.signin .closebtn').hide();
          $('.signin .content').css({
            'padding-top': '25px'
          });
          $('.saleDetail .signin').show();
          $('.saleDetail .signin .tsinfo').show();
          $('.saleDetail .signin .content').show();
          $('body,html').addClass('overflow');
        } else {

          if (!request) {

            // 获取用户信息
            axios.post(baseUrl + '/app/userInfo', {}, {
                headers: {
                  'token': localStorage.getItem('token')
                }
              })

              .then(function (res) {

                // 1 登录成功
                if (res.data.code == 0 && res.data.msg == 'success') {
                  console.log('----获取用户信息成功-----', res);
                  // 显示用户名
                  if (res.data.user) {
                    setTimeout(() => {
                      res.data.user.username && $('#xrcontent #sendConsults #f-name').val(res.data.user
                        .username);
                      res.data.user.email && $('#xrcontent #sendConsults #f-email').val(res.data.user.email);
                      res.data.user.mobile && $('#xrcontent #sendConsults #f-phone').val(res.data.user
                        .mobile);

                    }, 100)
                  }

                } else {

                  console.log('-----获取用户信息失败-----', res);

                }

              })

              .catch(function (res) {
                console.log('-----请求用户信息失败-----', res);
              });
          }

        }
      };

      usertologin();

      // 10 获取 Similar Listings 类似列表
      function getSimilarListings() {
        var token = localStorage.getItem('token');
        if (!token) {
          var similarList = [];
          var html9 = template('similar', {
            slist: similarList
          });
          $('.saleDetail #index-portfolio #detailSimilarList').html(html9);

        } else {

          // 请求
          var params30 = {
            "area": saledetail.property.area,
            "listPrice": saledetail.listPrice,
            "lat": saledetail.geo.lat,
            "lng": saledetail.geo.lng,
            "mlsId": saledetail.mlsId
          };
          console.log('-----获取 Similar Listings 传参-----', params30);

          axios.post(baseUrl + '/mclient/srts/list4Similar', params30, {
              headers: {
                'token': localStorage.getItem('token')
              }
            })

            .then(function (res) {

              if (res.data.code == 0 && res.data.msg == "success") {
                console.log('-----获取 Similar Listings 成功-----', res);

                var getTheList = res.data.results;
                var similarList = [];
                if (getTheList && getTheList.length) {
                  getTheList.map((item, index, arr) => {
                    if (index >= 0 && index <= 3) {
                      similarList.push(item);
                    }
                  })
                }

                // 处理
                if (similarList && similarList.length) {
                  similarList.map((item, index, arr) => {
                    if (item.listPrice) {
                      item.listPrice = formatNum(item.listPrice);
                    }
                  })
                }

                var html8 = template('similar', {
                  slist: similarList
                });
                $('.saleDetail #index-portfolio #detailSimilarList').html(html8);

                $("#owl-simexample").owlCarousel({
                  items: 4,
                  lazyLoad: false,
                  autoPlay: false,
                  navigation: false,
                  navigationText: false,
                  pagination: true
                });


              } else {
                console.log('----- 获取 Similar Listings 报错 -----', res.data.msg);
              }

            })

            .catch(function (error) {
              console.log('----- 获取 Similar Listings 失败 -----', error);
            });

        }
      
      };

      // 11 获取 Others Also Viewed
      function getOtherListings() {
        var token = localStorage.getItem('token');
        if (!token) {
          var OthersList = [];
          var html2 = template('other', {olist: OthersList});
          $('.saleDetail #index-news #detailOthersList').html(html2);

        } else {

          // 请求
          var params5 = {
            "mlsId": saledetail.mlsId + ''
          };
          console.log('-----获取 Others Also Viewed 传参-----', params5);

          axios.post(baseUrl + '/mclient/srts/list4Others', params5, {
              headers: {
                'token': localStorage.getItem('token')
              }
            })

            .then(function (res) {

              if (res.data.code == 0 && res.data.msg == "success") {
                console.log('-----获取 Others Also Viewed 成功-----', res);

                var getTheList = res.data.listRecommend;
                var OthersList = [];
                if (getTheList && getTheList.length) {
                  getTheList.map((item, index, arr) => {
                    if (index >= 0 && index <= 3) {
                      OthersList.push(item);
                    }
                  })
                }

                // 处理
                if (OthersList && OthersList.length) {
                  OthersList.map((item, index, arr) => {
                    if (item.listPrice) {
                      item.listPrice = formatNum(item.listPrice);
                    }
                  })
                }

                var html2 = template('other', {olist: OthersList});
                $('.saleDetail #index-news #detailOthersList').html(html2);

                $("#owl-otherEx").owlCarousel({
                  items : 4,
                  lazyLoad : false,
                  autoPlay : false,
                  navigation : false,
                  navigationText : false,
                  pagination : true,
                });


              } else {
                console.log('-----报错-----', res.data.msg);
              }

            })

            .catch(function (error) {
              console.log('-----获取 Others Also Viewed 失败-----', error);
            });
        
        }

      };

      // 12.1 点击每项 -- Similar Listings
      $('.saleDetail #detailSimilarList').on('click', '.item', function (e) {

        var id = $(this).data().id;
        // 跳转详情页
        window.location.href = `./saleDetail.html?id=${id}`;

      });

      // 12.2 点击每项 -- Others Also Viewed
      $('.saleDetail #detailOthersList').on('click', '.item', function (e) {

        var id = $(this).data().id;
        // 跳转详情页
        window.location.href = `./saleDetail.html?id=${id}`;

      });


      // 2.2 判断
      $(window).resize(function () {
        usertologin(1);
      })

      // 3 点击--分享
      $('#xrcontent').on('click', '#fenxiang', function () {
        $('.saleDetail #shareBox').show();
        $('.saleDetail #shareBox .content').slideDown();
      });

      // 3.2 share弹出框 -- 关闭
      $('.saleDetail').on('click', '#shareBox', function (e) {
        var theelem = e.target ? e.target : e.srcElement;
        var classname = theelem.className;

        if (classname == 'share' || classname == 'closebtn') {
          $('.saleDetail #shareBox .content').slideUp();
          setTimeout(() => {
            $('.saleDetail #shareBox').hide();
          }, 100)
        }
      })


      // 4 分享弹窗
      // 4.1 点击--发送
      $('#shareBox #sendEamil').on('click', '.sendSubmit', function () {
        var email = $('#shareBox #sendEamil #recipientEmail').val();
        var myemail = $('#shareBox #sendEamil #yourEmail').val();
        var content1 = $('#shareBox #sendEamil .sharestreent').val();

        if (!email) {
          $('#sendEamil .email .ts').show();
          return;
        } else {

          var reg = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
          if (!reg.test(email)) {
            $('#sendEamil .email .ts').show();
            return;
          }

        }

        if (!myemail) {
          $('#sendEamil .myemail .ts').show();
          return;
        } else {

          var reg = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
          if (!reg.test(myemail)) {
            $('#sendEamil .myemail .ts').show();
            return;
          }

        }

        // 请求
        var params1 = {
          'mfrom': myemail,
          'mto': email,
          'mcontent': content1,
        }

        console.log('-----分享传参-----', params1)

        axios.post(baseUrl + '/mclient/member/sendShareMail', params1, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            // 1 登录成功
            if (res.data.code == 0 && res.data.msg == 'success') {

              console.log('-----发送邮件成功-----', res);

              // 弹窗关闭
              $('.saleDetail #shareBox .content').slideUp();
              setTimeout(() => {
                $('.saleDetail #shareBox').hide();
              }, 100)

              // 提示
              $('.commonTips .txt').text('The mail was sent successfully.');
              $('.commonTips').show();

              setTimeout(() => {
                $('.commonTips').hide();
              }, 7000)

            } else {

              console.log('-----发送邮件失败-----', res);

              // 弹窗关闭
              $('.saleDetail #shareBox .content').slideUp();
              setTimeout(() => {
                $('.saleDetail #shareBox').hide();
              }, 100)

              $('.commonTips .txt').text('Failed to send mail.');
              $('.commonTips').show();

              setTimeout(() => {
                $('.commonTips').hide();
              }, 7000)


            }

          })

          .catch(function (res) {
            console.log('-----请求发送邮件失败-----', res);
          });

      })

      // 4.2.1 email-focus
      $('#sendEamil .email #recipientEmail').focus(function () {
        $('#sendEamil .email .ts').hide();
      })

      // 4.2.2 myemail-focus
      $('#sendEamil .myemail #yourEmail').focus(function () {
        $('#sendEamil .myemail .ts').hide();
      })

      // 5 点击--收藏
      $('#xrcontent').on('click', '#collecting ', function () {

        // 前提--登录
        if (localStorage.getItem('token')) {

          var item1 = $(this).data().item;

          // 请求
          var params2 = {
            'mlsId': item1.mlsId + '',
            'propertiesData': item1,
            'actionDo': item1.isCollect == 1 ? -1 : 1 // -1 取消
          };

          axios.post(baseUrl + '/mclient/member/collectProperties', params2, {
              headers: {
                'token': localStorage.getItem('token')
              }
            })

            .then(function (res) {

              if (res.data.code == 0 && res.data.msg == "success") {
                console.log('-----收藏成功-----', res);

                // api中无字段判断
                // 1.1 刷新列表
                saledetail.isCollect = saledetail.isCollect == 1 ? -1 : 1;

                // 1.2 渲染
                var html = template('detail', {
                  saledetail: [saledetail]
                });

                $('#innerpage-wrap #xrcontent').html(html);

                // 2 获取收藏数
                getLikeList();

              } else {
                console.log('-----收藏不成功-----', res);
              }

            })

            .catch(function (res) {
              console.log('-----请求收藏接口失败-----', res);
            });
        }

      })

      // 6 获取收藏数
      var likeListResult = [];

      function getLikeList() {

        axios.post(baseUrl + '/mclient/member/collectList', {}, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            if (res.data.code == 0 && res.data.msg == "success") {
              console.log('-----获取收藏列表成功-----', res);
              likeListResult = res.data.results;

              if (likeListResult) {
                $('.aboutUser #userFavourite .favNum').text(likeListResult.length);
                $('.users .afters #faNum').text(likeListResult.length); //移动端
              }

            } else {
              console.log('-----获取收藏列表不成功-----', res);
            }

          })

          .catch(function (res) {
            console.log('-----请求收藏列表接口失败-----', res);
          });

      };

      // 7 点击--发送代理咨询
      $('#xrcontent').on('click', '#sendConsults #subSend', function () {
        // 日期
        var sdate = $('#sendConsults #f-date').val();
        // 姓名
        var sname = $('#sendConsults #f-name').val();
        // 邮件
        var semail = $('#sendConsults #f-email').val();
        // 电话
        var sphone = $('#sendConsults #f-phone').val();


        // if (!sdate) {
        //   $('#sendConsults #selectDate .ts').show();
        //   return;

        // } else {
        //   // 处理时间
        //   var s = sdate;
        //   var y = s.substr(s.lastIndexOf('/') + 1, 4);
        //   var m = s.substr(0, s.indexOf('/'));
        //   var d = s.substr(s.indexOf('/') + 1, 2);
        //   sdate = y + '-' + m + '-' + d;

        // }

        if (!sname) {
          $('#sendConsults #myNameS .ts').show();
          return;
        }

        if (!semail) {
          $('#sendConsults #myEmailS .ts').text('cannot be blank');
          $('#sendConsults #myEmailS .ts').show();
          return;
        } else {

          var reg = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
          if (!reg.test(semail)) {
            $('#sendConsults #myEmailS .ts').text('Please enter the correct email.');
            $('#sendConsults #myEmailS .ts').show();
            return;
          }

        }

        if (!sphone) {
          $('#sendConsults #myPhoneS .ts').show();
          return;
        }


        // 请求
        var params3 = {
          'preferredDate': sdate,
          'custName': sname,
          'email': semail,
          'phone': sphone,
        }

        axios.post(baseUrl + '/mclient/member/consultation', params3, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            // 1 登录成功
            if (res.data.code == 0 && res.data.msg == 'success') {

              console.log('-----发送咨询成功-----', res);

              setTimeout(() => {

                // 提示
                $('.commonTips .txt').text('The submission of the view request was successful.');
                $('.commonTips').show();

                setTimeout(() => {
                  $('.commonTips').hide();
                }, 7000)
              }, 1000)


            } else {

              console.log('-----发送咨询失败-----', res);

              setTimeout(() => {

                $('.commonTips .txt').text('Failed to submit a view request.');
                $('.commonTips').show();

                setTimeout(() => {
                  $('.commonTips').hide();
                }, 7000)
              }, 1000)

            }

          })

          .catch(function (res) {
            console.log('-----请求发送咨询失败-----', res);
          });

      })

      // 7.1 data-focus
      $('#innerpage-wrap').on('focus', '#f-date', function () {
        $('#sendConsults #selectDate .ts').hide();
      })

      // 7.2 name-focus
      $('#innerpage-wrap').on('focus', '#f-name', function () {
        $('#sendConsults #myNameS .ts').hide();
      })

      // 7.3 email-focus
      $('#innerpage-wrap').on('focus', '#f-email', function () {
        $('#sendConsults #myEmailS .ts').hide();
      })

      // 7.4 phone-focus
      $('#innerpage-wrap').on('focus', '#f-phone', function () {
        $('#sendConsults #myPhoneS .ts').hide();
      })

      // 8.1 点击--代理的 call
      $('#innerpage-wrap').on('click', '.contact .callphone', function () {
        $('.saleDetail #show-MobileTips').show();
        $('.saleDetail #show-MobileTips .content').slideDown();
      });

      $('#innerpage-wrap').on('click', '.methods .callphone', function () {
        $('.saleDetail #show-MobileTips').show();
        $('.saleDetail #show-MobileTips .content').slideDown();
      });

      // 8.2 点击--右侧 代理: view phone
      $('#xrcontent').on('click', '#view-agentPhone', function () {
        $('.saleDetail #show-MobileTips').show();
        $('.saleDetail #show-MobileTips .content').slideDown();
      });

      // 8.3 电话弹出框 -- 关闭
      $('.saleDetail').on('click', '#show-MobileTips', function (e) {
        var theelem = e.target ? e.target : e.srcElement;
        var classname = theelem.className;

        if (classname == 'mobileTips' || classname == 'closebtn') {
          $('.saleDetail #show-MobileTips .content').slideUp();
          setTimeout(() => {
            $('.saleDetail #show-MobileTips').hide();
          }, 100)
        }
      })

      // 8.4.1 点击--代理的 email
      $('#innerpage-wrap').on('click', '.contact .agentemail', function () {
        // $('#xrcontent #fenxiang').click();
        $('.saleDetail #sendEmailToagent').show();
        $('.saleDetail #sendEmailToagent .content').slideDown();

      });

      // 8.4.2 Email Agent 弹窗 -- 关闭
      $('.saleDetail').on('click', '#sendEmailToagent', function (e) {
        var theelem = e.target ? e.target : e.srcElement;
        var classname = theelem.className;

        if (classname == 'emailTips' || classname == 'closebtn') {
          $('.saleDetail #sendEmailToagent .content').slideUp();
          setTimeout(() => {
            $('.saleDetail #sendEmailToagent').hide();
          }, 100)
        }
      })

      // 8.4.3 底部 email
      $('#innerpage-wrap').on('click', '.methods .agentemail', function () {
        $('#innerpage-wrap .contact .agentemail').click();
      });


      // 8.4.4 点击--send
      $('#sendEmailToagent #sendtoAgent').on('click', '#isSend', function () {
        var email = $('#sendEmailToagent #sendtoAgent #fromEmail').val();
        var content2 = $('#sendEmailToagent #sendtoAgent .textinbox').val();

        if (!email) {
          $('#sendtoAgent .youremail .ts').show();
          return;
        } else {

          var reg = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
          if (!reg.test(email)) {
            $('#sendtoAgent .youremail .ts').show();
            return;
          }

        }


        // 请求
        var params1 = {
          'mfrom': email,
          'mto': 'charsellswaid@gmail.com',
          'mcontent': content2,
        }

        console.log('-----向代理发email传参-----', params1);

        axios.post(baseUrl + '/mclient/member/sendShareMail', params1, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            if (res.data.code == 0 && res.data.msg == 'success') {

              console.log('-----发送邮件成功-----', res);

              // 弹窗关闭
              $('.saleDetail #sendEmailToagent .content').slideUp();
              setTimeout(() => {
                $('.saleDetail #sendEmailToagent').hide();
              }, 100)

              // 提示
              $('.commonTips .txt').text('The mail was sent successfully.');
              $('.commonTips').show();

              setTimeout(() => {
                $('.commonTips').hide();
              }, 7000)

            } else {

              console.log('-----发送邮件失败-----', res);
              // 弹窗关闭
              $('.saleDetail #sendEmailToagent .content').slideUp();
              setTimeout(() => {
                $('.saleDetail #sendEmailToagent').hide();
              }, 100)
              
              // 提示
              $('.commonTips .txt').text('Failed to send mail.');
              $('.commonTips').show();

              setTimeout(() => {
                $('.commonTips').hide();
              }, 7000)


            }

          })

          .catch(function (res) {
            console.log('-----请求发送邮件失败-----', res);
          });


      })

      // 8.4.5 email-focus
      $('#sendtoAgent .youremail #fromEmail').focus(function () {
        $('#sendtoAgent .youremail .ts').hide();
      })

      // 9 点击日期
      $('#innerpage-wrap').on('click', '.apply #sendConsults .commoDates', function () {
        $('#innerpage-wrap #f-date').focus();
      });

    });
  </script>
</body>

</html>